<html>
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=3.0;">
<style>
body {
    border: 0 none;
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    /*position:relative;*/
}
#loading-mask {
    background-color: #000;
    height: 1024px;
    left: 0;
    position: absolute;
    top: 0;
    width: 1024px;
    z-index: 20000;
}
#image1
{
    /*position:relative;*/
}
.center {
    text-align: center;
}
</style>
<script type="text/javascript">
(function(doc) {    
     var addEvent = 'addEventListener',
     type = 'gesturestart',
     qsa = 'querySelectorAll',
     scales = [1, 1],
     meta = qsa in doc ? doc[qsa]('meta[name=viewport]') : [];
     
     function fix() {
     meta.content = 'width=device-width,minimum-scale=' + scales[0] + ',maximum-scale=' + scales[1];
     doc.removeEventListener(type, fix, true);
     }
     
     if ((meta = meta[meta.length - 1]) && addEvent in doc) {
     fix();
     scales = [.25, 3.0];
     doc[addEvent](type, fix, true);
     }   
}(document));
</script>
</head>
<body>
<div id="loading-mask"></div>
<div class="center">
    <img id='image1' src='%@' onload='display();'/>
</div>
<script type='text/javascript' >
function display() {
    var img = document.getElementById('image1');
    var imgOrigH = img.offsetHeight;
    var imgOrigW = img.offsetWidth;
    var bodyH = window.innerHeight;
    var bodyW = window.innerWidth;
    if((imgOrigW / imgOrigH) > (bodyW / bodyH)) {
        var imgNewHeight = (imgOrigH * bodyW) / imgOrigW;
        img.style.width = bodyW + 'px';
        img.style.height = imgNewHeight + 'px';
        img.style.paddingTop = (bodyH - imgNewHeight) / 2 + 'px';
        //img.style.top = (bodyH - img.offsetHeight) / 2 + 'px';
    } else {
        img.style.height = bodyH + 'px';
        img.style.width = (imgOrigW * bodyH) / imgOrigH + 'px';
        //img.style.left = (bodyW - img.offsetWidth) / 2 + 'px';
    }
	window.setTimeout(function() {
		document.getElementById('loading-mask').style.display = 'none';
	}, 100);
}
</script>
</body>
</html>